<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge">
  <title>欧冶金服 | 登录</title>
  <!-- Tell the browser to be responsive to screen width -->
  <meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
  <!-- Bootstrap 3.3.7 -->
  <link rel="stylesheet" href="bower_components/bootstrap/dist/css/bootstrap.min.css">
  <!-- Font Awesome -->
  <link rel="stylesheet" href="bower_components/font-awesome/css/font-awesome.min.css">
  <!-- Ionicons -->
  <link rel="stylesheet" href="bower_components/Ionicons/css/ionicons.min.css">
  <!-- Theme style -->
  <link rel="stylesheet" href="dist/css/AdminLTE.min.css">
  <!-- iCheck -->
  <link rel="stylesheet" href="plugins/iCheck/square/blue.css">
  <link rel="stylesheet" href="dist/css/in.css">
  <!-- Animate.css -->
  <link rel="stylesheet" href="css/animate.css">
  <!-- Icomoon Icon Fonts-->
  <link rel="stylesheet" href="css/icomoon.css">
  <!-- Bootstrap  -->
  <link rel="stylesheet" href="css/bootstrap.css">
  <!-- Superfish -->
  <link rel="stylesheet" href="css/superfish.css">

  <link rel="stylesheet" href="css/style.css">
  <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
  <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
  <!--[if lt IE 9]>
  <script src="https://oss.maxcdn.com/html5shiv/3.7.3/html5shiv.min.js"></script>
  <script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
  <![endif]-->

  <!-- Google Font -->
  <link rel="stylesheet" href="https://fonts.useso.com/css?family=Source+Sans+Pro:300,400,600,700,300italic,400italic,600italic">
  <style type="text/css">
    body {
      background: url(dist/img/boxed-bg.png) top center no-repeat;
      background-size: cover;
    }
  </style>
</head>

<body class="hold-transition">
  <div class="login-box">
    <div class="login-logo">
      <a href="">欧冶金服</a>
    </div>
    <!-- /.login-logo -->
    <div class="login-box-body">
      <!--下面是登陆页面-->
      <form id="login_form" action="" method="post">
        <div class="col-md-12 col-sm-12">
          <label class="checkbox-inline">
          <input type="radio" name="login_role" value="2" checked> 用户
        </label>
          <label class="checkbox-inline">
          <input  type="radio" name="login_role" value="3"> 管理员
        </label>
        </div>
        <br>
        <br>
        <div class="form-group has-feedback">
          <input id="login_username" type="text" list="ide" class="form-control" placeholder="账号" aria-describedby="basic-addon1">
          <span class="glyphicon glyphicon-user form-control-feedback"></span>
        </div>
        <div class="form-group has-feedback">
          <input id="login_password" type="password" class="form-control" placeholder="密码" aria-describedby="basic-addon1">
          <span class="glyphicon glyphicon-lock form-control-feedback"></span>
        </div>
        <div class="row">
          <div class="col-xs-8">
            <div class="checkbox icheck">
            </div>
          </div>
          <!-- /.col -->
          <div class="col-xs-4">
            <button type="button" class="btn btn-default btn-block" onclick="login_fun()">登录</button>
          </div>
          <!-- /.col -->
        </div>

      </form>


      <!--下面是注册页面-->
      <form id="enroll_form" action="" method="post">
        <div class="col-md-12 col-sm-12">
          <label class="checkbox-inline">
          <input type="radio" name="register_role" value="2" checked> 用户
        </label>
          <label class="checkbox-inline">
          <input type="radio" name="register_role" value="3"> 管理员
        </label>
        </div>
        <br>
        <br>
        <div class="form-group has-feedback">
          <input id="register_username" type="text" list="ide" class="form-control" placeholder="账号" aria-describedby="basic-addon1">
          <span class="glyphicon glyphicon-user form-control-feedback"></span>
          <datalist id="ide">
            <option value="1001">
            <option value="1002">
            <option value="2001">
              <option value="同济大学">
          </datalist>
        </div>
        <div class="form-group has-feedback">
          <input id="register_password" type="password" class="form-control" placeholder="密码" aria-describedby="basic-addon1">
          <span class="glyphicon glyphicon-lock form-control-feedback"></span>
        </div>
        <div class="row">
          <div class="col-xs-8">
            <div class="checkbox icheck">
            </div>
          </div>
          <!-- /.col -->
          <div class="col-xs-4">
            <button type="button" class="btn btn-default btn-block" onclick="register_fun()">注册</button>
          </div>
          <!-- /.col -->
        </div>

      </form>
      <a class="text-center" id="enroll_link">注册账户</a>
      <a class="text-center" id="login_link">登录账户</a>

    </div>
    <!-- /.login-box-body -->
  </div>
  <!-- /.login-box -->

  <!-- jQuery 3 -->
  <script src="js/jquery.min.js"></script>
  <!-- jQuery Easing -->
  <script src="js/jquery.easing.1.3.js"></script>
  <!-- Bootstrap -->
  <script src="js/bootstrap.min.js"></script>
  <!-- Waypoints -->
  <script src="js/jquery.waypoints.min.js"></script>
  <!-- Stellar -->
  <script src="js/jquery.stellar.min.js"></script>
  <!-- Superfish -->
  <script src="js/hoverIntent.js"></script>
  <script src="js/superfish.js"></script>

  <!-- Main JS -->
  <script src="js/main.js"></script>
  <script src="bower_components/jquery/dist/jquery.min.js"></script>
  <!-- Bootstrap 3.3.7 -->
  <script src="bower_components/bootstrap/dist/js/bootstrap.min.js"></script>
  <!-- iCheck -->
  <script src="plugins/iCheck/icheck.min.js"></script>
  <script>
    $(document).ready(function () {
      $("a#showCheckMRec1").click(function () {
        $("#checkMRec1").toggle();
      });
      $("a#showCheckMRec2").click(function () {
        $("#checkMRec2").toggle();
      });
      $("#enroll_link").click(function () {
        $("#enroll_form").show();
        $("#login_form").hide();
        $(this).hide();
        $("#login_link").show();
      });
      $("#login_link").click(function () {
        $("#enroll_form").hide();
        $("#login_form").show();
        $(this).hide();
        $("#enroll_link").show();
      });
    });
    function register_fun() {
      var rmbBalance = 0;
      var balance = 0;
      if ($('input[name="register_role"]:checked').val() == "3") {
        balance = 9999999;
        rmbBalance = 9999999;
      } else {
        balance = 0;
        rmbBalance = 0;
      }
      var postBody = {
        username: $('#register_username').val(),
        password: $('#register_password').val(),
        role: $('input[name="register_role"]:checked').val(),
        balance: balance,
        rmbBalance: rmbBalance
      };
      console.log(postBody.username + " " + postBody.password);
      $.ajax({
        type: 'POST',
        url: '/users/register',
        data: postBody,
        dataType: 'json',
        success: function (data) {
          console.log(JSON.stringify(data));
          alert("您已注册成功！");
          // alert(data);
        }
      }).error(function (err) {
        console.log(err);
        alert(err.responseText);
      });
      console.log('register_fun');
    }
    function login_fun() {

      var postBody = {
        username: $('#login_username').val(),
        password: $('#login_password').val(),
        role: $('input[name="login_role"]:checked').val()
      };
      console.log(postBody.username + " " + postBody.password);
      $.ajax({
        type: 'POST',
        url: '/users/login',
        data: postBody,
        dataType: 'json',
        success: function (data) {
          var role = $('input[name="login_role"]:checked').val();
          var jsonstr = JSON.stringify(data);
          console.log(data.err);
          function addCookie(objName, objValue, objHours) {//添加cookie   
            var str = objName + "=" + escape(objValue);
            if (objHours > 0) {//为0时不设定过期时间，浏览器关闭时cookie自动消失   
              var date = new Date();
              var ms = objHours * 3600 * 1000;
              date.setTime(date.getTime() + ms);
              str += "; expires=" + date.toGMTString();
            }
            document.cookie = str;
          }
          addCookie("name", postBody.username, 24);
          addCookie("password", postBody.password, 24);
          // addCookie("record_id", data.data[0]._id, 24); 
          var str = document.cookie;
          if (str == "") {
            alert("请开启您浏览器cookie选项");
          } else {
            if (role == "2") {
              addCookie("hname", postBody.username, 24);
              addCookie("role", $('input[name="login_role"]:checked').val(), 24);
              window.location.href = "user/market.html";
            } else if (role == "3") {
              addCookie("tname", postBody.username, 24);
              addCookie("role", $('input[name="login_role"]:checked').val(), 24);
              window.location.href = "admin/chongzhi.html";
            } else {
              alert("请选择角色");
            }
          }
        }
      }).error(function (err) {
        console.log(err);
        alert("错误：" + err.responseText);
      });
    }

  </script>
</body>

</html>